<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:s="http://jboss.org/schema/seam/taglib"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:fn="http://java.sun.com/jsp/jstl/functions">

<body>
    <ui:composition template="/WEB-INF/template.xhtml">
        <ui:define name="topnav">
            <ui:include src="/WEB-INF/incl/store_nav.xhtml">
                <ui:param name="page" value="shop" />
            </ui:include>
        </ui:define>
        
        <ui:define name="sidebar">
            <ui:include src="/WEB-INF/incl/login.xhtml" />
            <ui:include src="/WEB-INF/incl/searchbox.xhtml" />
            <ui:include src="/WEB-INF/incl/cart.xhtml" />
        </ui:define>
        
        <ui:define name="body">
            <f:subview id="noresults" rendered="#{searchResults==null}">
                <p> This is the DVD search screen.  Use the search box
                to the right to search for DVDs.  The search component
                is a conversational Seam component.  You can perform
                multiple searches in multiple windows, and Seam will
                keep them all separate.  The shopping cart, of course,
                is shared, allowing the customer to place items in the
                car from any of the search screens.</p>
            
                <div class="bestouter">
                    <ui:repeat value="#{topProducts}" var="item">
                        <div class="bestinner">
                            <div class="besttitle">
                                <s:link id="TitleLink" view="/dvd.xhtml">
                                    #{fn:length(item.title) gt 14 ? fn:substring(item.title,0,13) : item.title}
                                    <f:param id="ProductIdForTextLink" name="id" value="#{item.productId}"/>
                                </s:link>
                            </div>
                            <div class="bestimage">
                                <s:link id="ImageLink" view="/dvd.xhtml">
                                    <f:param id="ProductIdForImage" name="id" value="#{item.productId}"/>
                                    <img src="#{item.imageURL}" />
                                </s:link>
                            </div>
                        </div>
                    </ui:repeat>
                </div>
            </f:subview>
            
            <f:subview id="searchresults" rendered="#{searchResults.rowCount == 0}">
                <h2>
                    <h:outputText id="NoResultsMessage" value="#{messages.noSearchResultsHeader}" />
                </h2>
            </f:subview>
                
            <h:form id="SearchResultsForm" rendered="#{searchResults.rowCount > 0}">
                <div class="controlBar">
                    <div class="buttonbox">
                        <div class="button">
                            <h:commandLink id="NextPageLink" action="#{search.nextPage}" rendered="#{!search.lastPage}">
                                <img src="img/arrow-r.png" />
                            </h:commandLink>
                            &#160;
                        </div>
                        <div class="button">
                            <h:commandLink id="PreviousPageLink" action="#{search.prevPage}" rendered="#{!search.firstPage}">
                                <img src="img/arrow-l.png" />
                            </h:commandLink>
                            &#160;
                        </div>
                    </div>
                    
                    <div class="message">#{messages.searchResultsHeader}</div>
                </div>
                
                <h:dataTable id="SearchResultsTable"
                             value="#{searchResults}" 
                             var="product" 
                             styleClass="dvdtable" 
                             headerClass="dvdtablehead"
                             rowClasses="results"
                             columnClasses="dvdtablecol">
                    <h:column id="column1">
                        <f:facet id="AddToCartFacet" name="header">
                            <h:outputText id="AddToCartText" value="#{messages.searchResultsAdd}" />
                        </f:facet>
                        <h:selectBooleanCheckbox id="AddToCartCheckbox" value="#{searchSelections[product]}"/>
                    </h:column>
                    <h:column id="column2">
                        <f:facet id="TitleFacet" name="header">
                            <h:outputText id="TitleText" value="#{messages.searchResultsTitle}" />
                        </f:facet>
                        
                        <s:link id="TitleLink" view="/dvd.xhtml" value="#{product.title}">
                            <f:param id="ProductId" name="id" value="#{product.productId}"/>
                        </s:link>
                    </h:column>                        
                    
                    <h:column id="column3">
                        <f:facet id="StarringFacet" name="header">
                            <h:outputText id="StarringText" value="Starring" />
                        </f:facet>
                        <h:outputText id="StarringValue" value="#{product.actors[0].name}" />
                    </h:column>                        
                    
                    <h:column id="column4">
                        <f:facet id="PriceFacet" name="header">
                            <h:outputText id="PriceText" value="#{messages.searchResultsPrice}" />
                        </f:facet>
                        <h:outputText id="PriceValue" value="#{product.price}">
                            <f:convertNumber type="currency" currencySymbol="$" />
                        </h:outputText>
                    </h:column>                        
                </h:dataTable>
                
                <h:commandButton id="SearchUpdateButton"
                                 action="#{search.addAllToCart}" 
                                 value="#{messages.searchUpdateButton}"/>
                
            </h:form>        
        </ui:define>
    </ui:composition>
</body>
</html>




